<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org"
      xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity4"
      xmlns:v-bind="http://www.w3.org/1999/xhtml">
<head>

    <div th:fragment="header-meta">
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
        <meta name="renderer" content="webkit">
        <meta name="keywords" content="ByteDesk.com 微客服 在线客服系统 微信客服系统 智能客服系统 即时通讯云 企业协作系统 工单系统 App android ios 苹果 安卓 微信 微信公众平台 微服务 android iOS 微客服 App客服  App在线客服 App 在线咨询 移动开发者服务平台 微客服  在线客服  微博 新浪微博 微信 微语 聊天 移动聊天 免费 发信息 发图片 语音 weixin 离线消息 微博 私信 流量" />
        <meta name="description" content="ByteDesk.com 微客服 卓越的在线客服系统 微信客服系统 智能客服系统 即时通讯云 企业协作系统 工单系统 android ios 苹果 安卓 微信 微信公众平台 微服务 微客服 App在线客服 App在线咨询 android iOS 安卓 移动开发者服务平台 一款跨平台的在线客服工具。支持多个微博、绑定多个账号。通过获取微博用户关系链、粉丝、好友，挖掘潜在客户。" />
        <meta name="author" content="ByteDesk.com">
        <link rel="icon" href="/favicon.ico">
    </div>

    <div th:fragment="header-css">
        <!-- this is header-css -->
        <link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet">
        <link href="https://cdnjs.cloudflare.com/ajax/libs/element-ui/2.4.0/theme-chalk/index.css" rel="stylesheet">

        <!--iconfont.cn-->
        <link rel="stylesheet" href="//at.alicdn.com/t/font_761687_xivxue5rikg.css"/>
        <!--页面底部css-->
        <link rel="stylesheet" th:href="@{/css/footer.css}" />
        <!-- HTML5 shim, for IE6-8 support of HTML5 elements -->
        <!--[if lt IE 9]>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/r29/html5.min.js"></script>
        <![endif]-->
    </div>

</head>

<body>

    <div th:fragment="header">

        <noscript>
            <h2 style="color: #ff0000">貌似您的浏览器不支持Javascript。请启用支持Javascript并刷新网页，或者请更换您的浏览器为Chrome!</h2>
        </noscript>

        <nav class="navbar navbar-expand-lg navbar-dark bg-primary fixed-top">
            <button class="navbar-toggler" type="button" data-toggle="collapse"
                    data-target="#navbarsCollapse" aria-controls="navbarsCollapse"
                    aria-expanded="false" aria-label="Toggle navigation">
                <a class="navbar-brand" href="/"><span th:utext="#{title}"></span></a>
                <span class="navbar-toggler-icon"></span>
            </button>

            <div class="collapse navbar-collapse justify-content-md-center" id="navbarsCollapse">
                <a class="navbar-brand" href="/"><span th:utext="#{title}"></span></a>
                <ul class="navbar-nav">
                    <li class="nav-item" sec:authorize="isAnonymous()">
                        <a class="nav-link" href="/bytedesk/product/agent" target="_blank">产品案例</a>
                    </li>
                    <li class="nav-item" sec:authorize="isAnonymous()">
                        <a class="nav-link" href="/bytedesk/price" target="_blank">价格方案</a>
                    </li>
                    <li class="nav-item" sec:authorize="isAnonymous()">
                        <a class="nav-link" href="/bytedesk/download" target="_blank">下载地址</a>
                    </li>
                    <li class="nav-item" sec:authorize="isAnonymous()">
                        <a class="nav-link" href="/bytedesk/support/category?uid=201808221551193&cid=201808221712491" target="_blank">开发文档</a>
                    </li>
                    <li class="nav-item" sec:authorize="isAnonymous()">
                        <a class="nav-link" href="/bytedesk/support?uid=201808221551193" target="_blank">常见问题</a>
                    </li>
                    <li class="nav-item" sec:authorize="isAnonymous()">
                        <a class="nav-link" href="/bytedesk/about" target="_blank"><span th:utext="#{about}"></span></a>
                    </li>
                    <!--<li class="nav-item" sec:authorize="isAnonymous()">-->
                        <!--<a class="nav-link" href="/test" target="_blank">Test</a>-->
                    <!--</li>-->
                    <li class="nav-item dropdown">
                        <a class="nav-link dropdown-toggle" href="https://www.bytedesk.com"
                                                            id="dropdown08" data-toggle="dropdown"
                                                            aria-haspopup="true" aria-expanded="false"><span th:utext="#{language}"></span></a>
                        <div class="dropdown-menu" aria-labelledby="dropdown08">
                            <a class="dropdown-item" href="/?lang=zh_CN">中文</a>
                            <a class="dropdown-item" href="/?lang=en_US">English</a>
                        </div>
                    </li>
                </ul>
            </div>
        </nav>

    </div><!--end of header-->

    <div th:fragment="header-light">

        <noscript>
            <h2 style="color: #ff0000">貌似您的浏览器不支持Javascript。请启用支持Javascript并刷新网页，或者请更换您的浏览器为Chrome!</h2>
        </noscript>

        <nav class="navbar navbar-expand-lg navbar-light bg-light fixed-top" style="height: 70px;">
            <div class="container">
                <!--<a class="navbar-brand" href="#">Container</a>-->
                <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarsExample07" aria-controls="navbarsExample07" aria-expanded="false" aria-label="Toggle navigation">
                    <span class="navbar-toggler-icon"></span>
                </button>

                <div class="collapse navbar-collapse" id="navbarsExample07">
                    <ul class="navbar-nav mr-auto">
                        <li class="nav-item active">
                            <a class="nav-link" href="/" target="_blank"><span th:utext="#{title}"></span></a>
                        </li>
                    </ul>
                    <li class="nav-item" style="list-style: none;">
                        <a class="nav-link" href="/bytedesk/product/workOrder" target="_blank">提交工单</a>
                    </li>
                </div>
            </div>
        </nav>

    </div>

</body>
</html>
